import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';

class TodoItem extends PureComponent {
    constructor(props) {
        super(props);
        // 当组件的state或者props发生改变的时候，render就会重新执行
        this.state = {  }
    }

    // shouldComponentUpdate(nextProps, nextState) {
    //     if (nextProps.content !== this.this.props.content) {
    //         return true;
    //     } else {
    //         return false;
    //     }
    // }

    render() { 
        const { content, index, deleteIt } = this.props;
        return (
            <li onClick={deleteIt.bind(this, index)}>
                {content}
            </li>
        );
    }

    // 一个组件接收到了父组件的参数
    // 如果这个组件第一次存在于父组件中，不会执行。
    // 如果这个组件之前已经存在于父组件中，会执行。
    componentWillReceiveProps() {
        console.log('子组件 componentWillReceivedProps');
    }
}

// 接口
TodoItem.propTypes = {
    content: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), // <- 以下类型之一
    deleteIt: PropTypes.func,
    index: PropTypes.number
}

// 默认值
// TodoItem.defaultProps = {
//     test: 'Hello 我是测试的默认属性'
// }
 
export default TodoItem;